package ui.more_setting

import androidx.compose.foundation.*
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.window.WindowDraggableArea
import androidx.compose.material.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.ExperimentalComposeUiApi
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.shadow
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.pointer.PointerEventType
import androidx.compose.ui.input.pointer.onPointerEvent
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.compose.ui.window.Window
import androidx.compose.ui.window.WindowPosition
import androidx.compose.ui.window.rememberWindowState
import model.db.Db
import state.ApplicationWindowsState
import model.enums.ThemeType
import theme.EasyChatTheme
import ui.compose.RectIconButton


/**
 * @author wei kunJie
 * @date 2024/4/24 18:59:29
 */
@OptIn(ExperimentalComposeUiApi::class)
@Composable
fun MoreSettingWindows(
    easyChatTheme: MutableState<EasyChatTheme>,
    applicationWindowsState: ApplicationWindowsState,
    close: () -> Unit
) = Window(
    icon = painterResource("icon/ic_logo.svg"),
    transparent = true,//设置为透明窗口
    undecorated = true, //透明窗口必须取消装饰，这样就没默认的窗口标题栏和那些最小化、最大化、关闭什么的了
    onCloseRequest = close,
    title = "更多设置",
    state = rememberWindowState(width = 800.dp, height = 600.dp, position = WindowPosition(Alignment.Center))
) {
    //rememberCoroutineScope() 是一个用于在 Composable 函数中创建协程作用域
    val coroutineScope = rememberCoroutineScope()
    //创建ViewModel
    val viewModel = remember { MoreSettingViewModel(applicationWindowsState, coroutineScope) }
    val windowsCorner = 3.dp//窗口圆角大小
    //窗口表面，用来定窗口样式
    Surface(
        modifier = Modifier.fillMaxSize()
            .padding(5.dp)
            .shadow(3.dp, RoundedCornerShape(windowsCorner + 3.dp)),//窗口阴影样式
        color = easyChatTheme.value.mainWhite,
        shape = RoundedCornerShape(windowsCorner) //窗口圆角
    ) {
        Row(Modifier.fillMaxSize().background(color = easyChatTheme.value.mainColor2)) {
            //菜单列
            Column(
                Modifier.fillMaxHeight().width(200.dp).background(color = easyChatTheme.value.mainWhite)
                    .padding(top = 20.dp, start = 24.dp, end = 24.dp, bottom = 24.dp)
            ) {
                Text(text = "更多设置", textAlign = TextAlign.Center, modifier = Modifier.fillMaxWidth().height(20.dp))
                Spacer(Modifier.height(10.dp))
                Surface(
                    modifier = Modifier.fillMaxWidth(),
                    color = if (viewModel.settingType.value == MoreSettingType.Theme)
                        Color(0x25000000) else Color.Transparent,
                    shape = RoundedCornerShape(5.dp) //窗口圆角
                ) {
                    Row(
                        Modifier.fillMaxWidth().clickable(onClick = {
                            viewModel.settingType.value = MoreSettingType.Theme
                        }).padding(8.dp)
                    ) {
                        Icon(
                            painter = painterResource("icon/ic_theme.svg"),
                            contentDescription = "主题",
                            Modifier.size(21.dp)
                        )
                        Spacer(Modifier.width(10.dp))
                        Text(text = "主题")
                    }
                }
                Spacer(Modifier.height(10.dp))
                Surface(
                    modifier = Modifier.fillMaxWidth(),
                    color = if (viewModel.settingType.value == MoreSettingType.About)
                        Color(0x25000000) else Color.Transparent,
                    shape = RoundedCornerShape(5.dp) //窗口圆角
                ) {
                    Row(
                        Modifier.fillMaxWidth().clickable(onClick = {
                            viewModel.settingType.value = MoreSettingType.About
                        }).padding(8.dp)
                    ) {
                        Icon(
                            painter = painterResource("icon/ic_about.svg"),
                            contentDescription = "关于",
                            Modifier.size(18.dp)
                        )
                        Spacer(Modifier.width(13.dp))
                        Text(text = "关于")
                    }
                }

            }
            //内容
            if (viewModel.settingType.value == MoreSettingType.Theme) {
                Theme(Modifier.fillMaxHeight().weight(1f),easyChatTheme)
            }
        }
    }
    //窗口可拖动区域，鼠标按住后可以拖动窗口
    WindowDraggableArea {
        Surface(
            modifier = Modifier.fillMaxWidth().height(Dp(45f))
                .padding(5.dp),
            color = Color.Transparent,
            shape = RoundedCornerShape(windowsCorner, windowsCorner)
        ) {
            val isMouseIn = remember { mutableStateOf(false) }
            Row(verticalAlignment = Alignment.CenterVertically) {
                Spacer(Modifier.weight(1f))
                RectIconButton(
                    onClick = close,
                    modifier = Modifier.size(33.dp).background(
                        color = if (isMouseIn.value) Color(0xFFC42B1C)
                        else Color.Transparent
                    ).onPointerEvent(PointerEventType.Enter) { isMouseIn.value = true }
                        .onPointerEvent(PointerEventType.Exit) { isMouseIn.value = false },
                ) {
                    Icon(
                        painter = painterResource("icon/ic_close.svg"),
                        contentDescription = "关闭",
                        tint = if (isMouseIn.value) Color.White else Color.Black,
                        modifier = Modifier.size(33.dp).padding(9.dp)
                    )
                }
            }
        }
    }
}

enum class MoreSettingType {
    Theme, About
}

@Composable
fun Theme(modifier: Modifier,easyChatTheme: MutableState<EasyChatTheme>,) {
    LazyColumn(modifier = modifier.padding(top = 45.dp, start = 20.dp, end = 40.dp, bottom = 10.dp)) {
        items(listOf(1)) {
            Column(
                modifier = Modifier.fillMaxWidth().background(
                    color = easyChatTheme.value.mainWhite,
                    shape = RoundedCornerShape(5.dp)
                )
                    .padding(10.dp)
            ) {
                Text(text = "免费主题", fontSize = 16.sp, color = Color.Black)
                Spacer(modifier = Modifier.height(10.dp))
                Row(Modifier) {
                    Surface(
                        modifier = Modifier.weight(1f),
                        color = Color.Transparent,
                        shape = RoundedCornerShape(5.dp) //窗口圆角
                    ) {
                        Column(horizontalAlignment = Alignment.CenterHorizontally,
                            modifier = Modifier.fillMaxSize()
                                .clickable {
                                    easyChatTheme.value= EasyChatTheme(ThemeType.Blue)
                                    Db.updateThemeType(ThemeType.Blue)
                                }
                                .border(
                                    border = if (easyChatTheme.value.type== ThemeType.Blue)
                                        BorderStroke(0.8.dp, easyChatTheme.value.mainColor)
                                    else BorderStroke(0.dp, Color.Transparent),
                                    shape = RoundedCornerShape(5.dp)
                                )
                        ) {
                            Image(
                                painter = painterResource("image/img_theme_blue.png"),
                                contentDescription = "地蔚蓝",
                                modifier = Modifier.padding(top = 10.dp, start = 10.dp, end = 10.dp)
                            )
                            Spacer(modifier = Modifier.height(10.dp))
                            Text(text = "地蔚蓝", fontSize = 15.sp)
                            Spacer(modifier = Modifier.height(10.dp))
                        }
                    }
                    Spacer(modifier = Modifier.width(15.dp))
                    Surface(
                        modifier = Modifier.weight(1f),
                        color = Color.Transparent,
                        shape = RoundedCornerShape(5.dp) //窗口圆角
                    ) {
                        Column(horizontalAlignment = Alignment.CenterHorizontally,
                            modifier = Modifier.fillMaxSize()
                                .clickable {
                                    easyChatTheme.value= EasyChatTheme(ThemeType.Pink)
                                    Db.updateThemeType(ThemeType.Pink)
                                }
                                .border(
                                    border = if (easyChatTheme.value.type== ThemeType.Pink)
                                        BorderStroke(0.8.dp, easyChatTheme.value.mainColor)
                                    else BorderStroke(0.dp, Color.Transparent),
                                    shape = RoundedCornerShape(5.dp)
                                )
                        ) {
                            Image(
                                painter = painterResource("image/img_theme_pink.png"),
                                contentDescription = "樱花粉",
                                modifier = Modifier.padding(top = 10.dp, start = 10.dp, end = 10.dp)
                            )
                            Spacer(modifier = Modifier.height(10.dp))
                            Text(text = "樱花粉", fontSize = 15.sp)
                            Spacer(modifier = Modifier.height(10.dp))
                        }
                    }

                }
            }
        }
    }
}